<template>
  <div class="app-container">
    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
      <el-form-item label="文件名称" prop="fileName">
        <el-input v-model="queryParams.fileName" placeholder="请输入文件名称" clearable />
      </el-form-item>
      <el-form-item label="发文单位" prop="fileCompanyName">
        <el-input v-model="queryParams.fileCompanyName" placeholder="请输入发文单位" clearable />
      </el-form-item>
      <el-form-item label="发文单位类型" prop="fileType">
        <el-select v-model="queryParams.fileType" placeholder="请选择发文单位类型" clearable>
          <el-option v-for="dict in dict.type.list_quality_file_type" :key="dict.value" :label="dict.label"
            :value="dict.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="文件上传时间" prop="dateTime">
        <el-date-picker clearable v-model="queryParams.dateTime" type="daterange" value-format="yyyy-MM-dd"
          range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期">
        </el-date-picker>
      </el-form-item>
      <!-- <el-form-item label="逾期状态" prop="fileBeOverdueStatus">
        <el-select v-model="queryParams.fileBeOverdueStatus" placeholder="请选择逾期状态" clearable>
          <el-option v-for="dict in dict.type.list_quality_overdue_status" :key="dict.value" :label="dict.label"
            :value="dict.value" />
        </el-select>
      </el-form-item> -->
      <el-form-item>
        <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</el-button>
        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <div class="commonButtons">
      <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
      <!-- <el-button type="primary" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button> -->
      <!-- <el-button type="primary" plain icon="el-icon-check" size="mini" @click="handleAdd">整改完成</el-button> -->
      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
    </div>
    <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange">
      <el-table-column type="selection" width="55" align="center" />
      <el-table-column label="文件编码" prop="fileCode" />
      <el-table-column label="文件名称" prop="fileName" />
      <el-table-column label="发文单位" prop="fileCompanyName" />
      <el-table-column label="发文单位类型" prop="fileType">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.list_quality_file_type" :value="scope.row.fileType" />
        </template>
      </el-table-column>
      <el-table-column label="文件分类" prop="fileItem">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.list_quality_file_item_type" :value="scope.row.fileItem" />
        </template>
      </el-table-column>
      <el-table-column label="发文日期" prop="fileSubTime" />
      <el-table-column label="要求整改完成日期" prop="fileRectificationTime" />
      <el-table-column label="逾期状态" prop="fileBeOverdueStatus">
        <template slot-scope="scope">
          <dict-tag :options="dict.type.list_quality_overdue_status" :value="scope.row.fileBeOverdueStatus" />
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" align="center" width="300" class-name="small-padding fixed-width">
        <template slot-scope="scope">
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleView(scope.row)">查看</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleEdit(scope.row)">修改</el-button>
          <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleSplit(scope.row)">拆分</el-button>
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
      @pagination="getList" />
    <MainDialog :visible.sync="dialogVisible" v-if="dialogVisible" @refresh="getList" :data="selectRow" :title="title"
      :operateType="operateType">
    </MainDialog>
  </div>
</template>
<script>
import refreshMixin from "@/common/refreshMixin"
import MainDialog from "./components/mainDialog.vue"
import { getDataList, deletedData } from "./api"
export default {
  name: "QualityFile",
  dicts: ["list_quality_overdue_status", "list_quality_file_type", "list_quality_file_item_type"],
  mixins: [refreshMixin],
  components: { MainDialog },
  data() {
    return {
      loading: false,
      list: [],
      total: 0,
      showSearch: true,
      queryParams: {
        pageNum: 0,
        pageSize: 10,
        fileName: null,
        fileCompanyName: null,
        fileType: null,
        dateTime: [],
        fileBeOverdueStatus: null,
      },
      title: "",
      dialogVisible: false,
      selectRow: {},
      operateType: 'view',
      ids: []
    }
  },
  methods: {
    async getList() {
      this.loading = true;
      const fileUpTimeStart = this.queryParams.dateTime.length ? this.queryParams.dateTime[0] : null
      const fileUpTimeEnd = this.queryParams.dateTime.length ? this.queryParams.dateTime[1] : null
      const params = { ...this.queryParams, fileUpTimeStart, fileUpTimeEnd, dateTime: null, projectId: this.projectId }
      const res = await getDataList(params)
      this.list = res.rows
      this.total = res.total
      this.loading = false;
    },
    resetQuery() {
      this.resetForm("queryForm");
      this.getList();
    },
    handleView(row) {
      this.operateType = 'view'
      this.selectRow = { ...row }
      this.title = "质量问题文件详情";
      this.dialogVisible = true;
    },
    handleAdd() {
      this.operateType = 'add'
      this.selectRow = {};
      this.title = "新增质量问题文件";
      this.dialogVisible = true;
    },
    handleEdit(row) {
      this.operateType = 'edit'
      this.selectRow = { ...row }
      this.title = "编辑质量问题文件";
      this.dialogVisible = true;
    },
    handleSplit(row) {
      this.operateType = 'split'
      this.selectRow = { ...row }
      this.title = "质量问题文件拆分";
      this.dialogVisible = true;
    },
    handleSelectionChange(selection) {
      this.ids = selection.map(item => item.id)
    },
    handleExport() {
      const fileUpTimeStart = this.queryParams.dateTime.length ? this.queryParams.dateTime[0] : null
      const fileUpTimeEnd = this.queryParams.dateTime.length ? this.queryParams.dateTime[1] : null
      const params = { ...this.queryParams, fileUpTimeStart, fileUpTimeEnd, dateTime: null, projectId: this.projectId }
      this.download('/quality/qualityFile/export', {
        ...params
      }, `attach_${new Date().getTime()}.xlsx`)
    },
    async handleDelete(row) {
      const res = await this.$confirm('是否确认删除编号为' + row.id + '的数据项？', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
      if (res == 'confirm') {
        const res1 = await deletedData(row.id);
        if (res1.code == 200) {
          this.getList();
          this.$message.success("删除成功")
        }
      }
    },
    async doComplete() {
      if (!this.ids.length) {
        return this.$message.warning("请先选择数据项")
      }
      const res = await this.$confirm('是否对所选数据项进行整改完成操作？', "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
      if (res == 'confirm') {
        const res1 = await delType(row.id);
        if (res1.code == 200) {
          this.getList();
          this.$message.success("删除成功")
        }
      }
    },
  }
}
</script>
<style lang="scss" scoped>
.commonButtons {
  margin-bottom: 10px;
}
</style>